<template>
  <div>
    <div>
      <MyButton>默认按钮</MyButton>
      <MyButton type="primary">主要按钮</MyButton>
      <MyButton type="success">成功按钮</MyButton>
      <MyButton type="info">信息按钮</MyButton>
      <MyButton type="warning">警告按钮</MyButton>
      <MyButton type="danger">危险按钮</MyButton>
    </div>
    <div style="margin: 20px 0">
      <MyButton plain>朴素按钮</MyButton>
      <MyButton type="primary" plain>主要按钮</MyButton>
      <MyButton type="success" plain>成功按钮</MyButton>
      <MyButton type="info" plain>信息按钮</MyButton>
      <MyButton type="warning" plain>警告按钮</MyButton>
      <MyButton type="danger" plain>危险按钮</MyButton>
    </div>

    <div>
      <MyButton round>圆形按钮</MyButton>
      <MyButton type="primary" round>主要按钮</MyButton>
      <MyButton type="success" round>成功按钮</MyButton>
      <MyButton type="info" round>信息按钮</MyButton>
      <MyButton type="warning" round>警告按钮</MyButton>
      <MyButton type="danger" round>危险按钮</MyButton>
    </div>
    <div style="margin: 20px 0">
      <MyButton disabled>默认按钮</MyButton>
      <MyButton type="primary" disabled>主要按钮</MyButton>
      <MyButton type="success" disabled>成功按钮</MyButton>
      <MyButton type="info" disabled>信息按钮</MyButton>
      <MyButton type="warning" disabled>警告按钮</MyButton>
      <MyButton type="danger" disabled>危险按钮</MyButton>
    </div>

    <div style="margin-top: 20px">
      <MyButton plain disabled>朴素按钮</MyButton>
      <MyButton type="primary" plain disabled>主要按钮</MyButton>
      <MyButton type="success" plain disabled>成功按钮</MyButton>
      <MyButton type="info" plain disabled>信息按钮</MyButton>
      <MyButton type="warning" plain disabled>警告按钮</MyButton>
      <MyButton type="danger" plain disabled>危险按钮</MyButton>
    </div>
    <div>
      <MyButton type="text">文字按钮</MyButton>
      <MyButton type="text" disabled>文字按钮</MyButton>
    </div>
    <div style="margin-top: 20px">
      <MyButton type="primary" icon="el-icon-edit"></MyButton>
      <MyButton type="primary" icon="el-icon-share"></MyButton>
      <MyButton type="primary" icon="el-icon-delete"></MyButton>
      <MyButton type="primary" icon="el-icon-search">搜索</MyButton>
      <MyButton type="primary"
        >上传<i class="el-icon-upload el-icon--right"></i
      ></MyButton>
    </div>
    <div style="margin-top: 20px">
      <MyButton type="primary" :loading="true">加载中</MyButton>
    </div>
  </div>
</template>
<script>
import MyButton from "./06zuoye/button/MyButton.vue";
export default {
  components: {
    MyButton,
  },
  name: "",
  data() {
    return {};
  },
  created() {},
  computed: {},
  methods: {},
};
</script>
<style lang='less'  scoped>
div {
  div {
    display: flex;
  }
}
</style>
